<!DOCTYPE html>  
<html lang="en">  
<head>  
<meta charset="UTF-8">  
<title>Angle Calculator</title>  
<style>
    select {
        height: 80px;
    width: 80px;
    font-size: 20px;
    padding: 11px;
    }
</style>
<script>  
function calculateAngleSum() {  
  // 获取下拉框选中的值  
  var angle1 = document.getElementById('angle1').value;  
  var angle2 = document.getElementById('angle2').value;  
  
  // 检查是否有有效的角度值  
  if (angle1 && angle2) {  
    // 计算角度之和  
    var sum = parseInt(angle1, 10) + parseInt(angle2, 10);  
  
    // 显示结果  
    document.getElementById('result').textContent = angle1 + '° + ' + angle2 + '° = ' + sum + '°';  
  } else {  
    // 如果没有选择角度，则清空结果  
    document.getElementById('result').textContent = '';  
  }  
}  
</script>  
</head>  
<body>  
  
<h2>选择两个角度以生成算式</h2>  
  
<!-- 下拉框用于选择角度 -->  
<label for="angle1">角度 1:</label>  
<select id="angle1">  
  <option value="30">30°</option>  
  <option value="45">45°</option>  
  <option value="60">60°</option>  
  <option value="90">90°</option>  
</select>  
  
<label for="angle2">角度 2:</label>  
<select id="angle2">  
  <option value="30">30°</option>  
  <option value="45">45°</option>  
  <option value="60">60°</option>  
  <option value="90">90°</option>  
</select>  
  
<!-- 显示结果的元素 -->  
<p id="result"></p>  
  
<!-- 按钮用于触发计算过程 -->  
<button onclick="calculateAngleSum()">生成算式</button>  
  
</body>  
</html>